/**************************************
 *
 * VLOOK™ 模板主题
 *
 * powered by MAX°孟兆
 *
 * QQ Group: 805502564
 * Telegram Channel: t.me/vlook_markdown
 * email: maxchow@qq.com
 *
 * For(wechat): MaxChow
 * 2023-3
 *
 *************************************/

@import "../font";
@import "../color";
@import "../common";

// 主题信息
@themeVer: "V28.1";
@themeName: "vlook-x-dic";
@themeDesc: "× DIC";
@themeEmail: "maxchow@qq.com";

// 指定字体主题
// .applyFontStyle(win);
.applyFontStyle(local);
// .applyFontStyle(sans);
// .applyFontStyle(serif);
// .applyFontStyle(albb);
// .applyFontStyle(book);
// 文档背景使用图片
.applyDocBgImg(@docBgImgLight_Twill_R, @docBgImgDark_Twill_R);
// 指定主题配套的圆角
.applyThemeRadius(leaf);
// 表格、插图指定居中对齐
.genTableAndFigureAlign(center);
// 生成指定的表格样式
.genTableStyle(vivid);

:root {
    --thm-fav-logo-lg: url("");
    --thm-fav-logo-dk: var(--thm-fav-logo-lg);
}

// 主题主色
@theme1: #009FE9;//#00A0E6;
@theme2: #D71517;//#E60012;
@theme3: #FFFFFF;
@theme1Dark: #00A7F5;//darken(@theme1, 20%);
@theme1Alt: #CCEFFF;//lighten(@theme1, 15%);
@theme1AltDark: #004666;//darken(@theme1, 35%);//@codeBgColorDark;
@theme2Dark: #DF1618;//darken(@theme2, 20%);
@theme2Alt: #FADCDD;//lighten(@theme2, 20%);//lighten(@theme2, 50%);
@theme2AltDark: #5D090A;//darken(@theme2, 35%);//darken(@theme2Alt, 75%);
@theme1Fade: rgba(red(@theme1), green(@theme1), blue(@theme1), @accOpacity);
@theme2Fade: rgba(red(@theme2), green(@theme2), blue(@theme2), @accOpacityLowForLg);
@theme2FadeDark: rgba(red(@theme2Dark), green(@theme2Dark), blue(@theme2Dark), @accOpacity);

// 标题色
@headerColor: @theme1;
@headerColorDark: @theme1Dark;
// 渐变标题色 h1-h5
@lg: linear-gradient(90deg, @theme1 25%, #2060E0);
.genLinearGradientHeader(h1, @lg);
.genLinearGradientHeader(h2, @lg);
.genLinearGradientHeader(h3, @lg);
.genLinearGradientHeader(h4, @lg);
.genLinearGradientHeader(h5, @lg);

@headerBackground: none;
@headerPadding: 10px 0 0 0;

@h1NumSeparator: "";
@vHeaderAutoNum: "h1{{#00##}}";
@h1BeforeContent: "0" counter(h1);
@h6BeforeContent: "▰" @h6NumSeparator;

// h1-6::before 的扩展样式
.genH1beforeExt() {
    display: block;
    font-size: 2.5em;
    font-weight: 300;
}

@headerTextAlign: left;
@h1TextAlign: center;

// 题注文字、背景色
// @captionTextColor: var(--d-fc-a);
@captionBackground: none;

// 行内代码
@codeTextColor: @theme2;

// 按钮色
@buttonForeColor: @theme3;
@buttonForeHoverColor: @theme3;
@buttonBgColor: @theme1;
// 文库按钮颜色
@docLibButtonForeColor: @buttonForeColor;
@docLibButtonForeHoverColor: @buttonForeHoverColor;
@docLibButtonBgColor: @buttonBgColor;
// 指定 kbd 按钮风格
.applyKbdRadius(leaf);

// 链接颜色
@aBorderWidth: 2px;
@aColor: @headerColor;
@aColorDark: @headerColorDark;
// @alinecolor: @theme2;
@aHoverColor: @theme2;
@aHoverColorDark: @theme2Dark;
@aActiveColor: desaturate(@aHoverColor, 25%);

@badgeBorderWidthInCover: 0;

// 封面、封底文字位置及对齐方式
@coverTextAlign: left;
@coverTextPadding: 70px 60px 0;
@coverTextPaddingForMobile: 70px 20px 0;
@coverTextColor: @theme3;
@coverSubColor: @theme1Alt;
@coverUnderlineColor: @coverSubColor;
@coverAuthorColor: @coverUnderlineColor;
@coverOwnerColor: @coverUnderlineColor;

@backcoverTextAlign: right;
@backcoverTextPadding: @coverTextPadding;
@backcoverTextPaddingForMobile: @coverTextPaddingForMobile;
@backcoverTextColor: @theme3;

// 封面、封底标题的文字阴影样式
@coverTextShadow: 3px 3px 4px rgba(0, 0, 0, .25);
@backcoverTextShadow: -3px 3px 4px rgba(0, 0, 0, .25);

// 对比度边框色，用于主题色与背景色对比度比较低时的边缘视觉识别
@contrastBorder: 0 0 0 0 transparent;
@contrastBorderForCover: 0 0 0 2px fade(@theme1, 20%) inset;

// 封面背景设置
@coverBackgroundColor: @theme1;
@coverBackgroundImage: var(--thm-logo), var(--thm-c-bg-e), var(--thm-c-right-bg), var(--thm-c-tree), var(--thm-c-bg-lg);
@coverBgSize: auto, auto, 230px 250px, auto, auto;
@coverBgSizeForMobile: auto, auto, 230px 250px, 300px 270px, auto;
@coverBackgroundSize: var(--thm-c-bg-size);
@coverBackgroundRepeat: no-repeat, repeat-x, no-repeat, no-repeat, no-repeat;
@coverBgPosition: 60px 560px, right bottom, right bottom 120px, right bottom 120px, left top;
@coverBgPositionForMobile: 20px 560px, right bottom, right bottom 120px, right bottom 120px, left top;
@coverBackgroundPosition: var(--thm-c-bg-pos);

// 封底背景设置
@backcoverBackgroundColor: @coverBackgroundColor;
@backcoverBackgroundImage: var(--thm-logo), var(--thm-bc-bg-e), var(--thm-bc-left-bg), var(--thm-bc-tree), var(--thm-bc-bg-lg);
@backcoverBgSize: auto, auto, 230px 190px, auto, auto;
@backcoverBgSizeForMobile: auto, auto, 230px 190px, 300px 270px, auto;
@backcoverBackgroundSize: var(--thm-bc-bg-size);
@backcoverBackgroundRepeat: @coverBackgroundRepeat;
@backcoverBgPosition: right 60px top 400px, left bottom, left top 170px, left bottom 50px, right top;
@backcoverBgPositionForMobile: right 20px top 400px, left bottom, left top 170px, left bottom 120px, right top;
@backcoverBackgroundPosition: var(--thm-bc-bg-pos);

// 文档扩展区域背景
// @docExtBackgroundColor: var(--d-bc);
@docExtBackgroundImage: var(--thm-doc-ext-bg), var(--thm-doc-ext-logo);
@docExtBackgroundSize: auto, auto;
@docExtBackgroundRepeat: no-repeat, repeat;
@docExtBackgroundPosition: left top, left bottom;

// 封面、封底素材资源
:root {
    --thm-c-tree: url("");
    --thm-c-bg-e: url("");
    --thm-c-right-bg: url("");
    --thm-logo: url("");
    --thm-c-bg-lg: linear-gradient(135deg, @theme1 40%, #2060E0);
    // backcover
    --thm-bc-tree: url("");
    --thm-bc-bg-e: var(--thm-c-bg-e);//url("");
    --thm-bc-left-bg: url("");
    --thm-bc-bg-lg: linear-gradient(200deg, @theme1 40%, #2060E0);
    // doc-ext-bg
    --thm-doc-ext-logo: url("");
}

@import "../base";

// ====================
// 标题 after 样式
@{headerAfter} {
    content: "";
    background: @theme1;
    opacity: .3;
    width: .625em;
    height: .625em;
    border-radius: .25em 0;
    margin: 5px;
    position: relative;
    display: inline-flex;
    vertical-align: top;
}
// 针对封底 span::after 的微调处理
@{backcoverSpanAfter},
@{backcoverSpanWithoutYAMLafter} {
    content: "" !important;
    background: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    position: absolute !important;
}

// 生成加粗文本扩展样式
.genExtBoldText();
// 生成下划线文本扩展样式
.genExtUnderText();
// 生成高亮文本扩展样式
.genExtHighlightText(@quoteBeforeImage_l01, @quoteAfterImage_l01, .8);

// 生成线框风格的有序列表样式
.genOrderList(frame, rect);

// 生成指定风格的多级标签样式
.genBadgeStyle(cap, dyn);

// 生成 GSA 样式
.genGSA_simple();
